import styled from "styled-components";
import { Link } from "react-router-dom";
import React from "react";

const NavBox = styled.nav`
  a {
    margin-right: 10px;
    color: #000;
  }
`;

class HomeHead extends React.Component {
  render() {
    const { history } = this.props;
    console.log("props", history);
    return (
      <NavBox>
        <Link to="/">A</Link>
        <Link to="/b">B</Link>
        <Link to="/c">C</Link>
      </NavBox>
    );
  }
}

// 在类组件中如果没有被Route包裹是无法通过porps获取路由信息的，所以可以使用一个高阶组件完成
// function Handle(Component) {
//   // 返回一个代理高阶组件
//   return function Hoc(props) {
//     const history = useHistory();
//     return <Component {...props} history={history} />;
//   };
// }

export default HomeHead;
